<template>
    <div class="container">
        <Header></Header>
        <div class="main">
           <div>
             <h1>我的作品和模版</h1>
                <div class="tab">
                    <p class="active">我的作品</p>
                    <p>参与协作的作品</p>
                </div>
           </div>
        </div>
    </div>
</template>
<script setup lang="ts">
import Header from '../components/header.vue'

</script>
<style lang="scss" scoped>
   .container{
    width: 100vw;
    height: 100vh;
    .main{
        width: 100%;
      >div{
        margin-left: 1rem;
          .tab{
            list-style: none;
            display: flex;
            p{
                margin: 0 0.5em;
                
            }
           .active{
                border-bottom: 0.1rem solid skyblue;
            }
            p:hover{
                border-bottom: 0.1rem solid skyblue;
            }
        }
      }
        
    }
   }
</style>